<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>kcwebplus</title>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta name="HandheldFriendly" content="true"/>
<meta name="MobileOptimized" content="320"/>
<%include file="../include/static.html"/>
<style>
*{padding:0px;margin:0px}
.el-header, .el-footer {background-color: #B3C0D1;line-height: 60px;padding:0px;}
.kcw-side-scroll::-webkit-scrollbar{width:0px}
</style>
</head>
<body>
<div id="app" class="background">
    <div style="height:33px;padding-top:10px;margin:4px auto;width:100%;background:#FFF">
        &nbsp&nbsp
        <el-button-group>
            <el-input size="mini" style="width:200px;float:left" placeholder="用户名/姓名/昵称/手机" v-model="kw"></el-input>
            <el-button size="mini" icon="el-icon-search" @click="data.pagenow=1;getlist()" type="success">搜索</el-button>
            <el-button size="mini" type="success"  @click="admindialog={status:true,title:'添加管理员'},admin={name:'',icon:'',username:'',phone:'',nickname:''}">添加管理员账户</el-button>
        </el-button-group>
        <el-button-group style="float:right">
            <el-button size="mini" @click="dellogin()" type="danger" title="退出所有登录用户">清除所有会话</el-button>
        </el-button-group>
        
    </div>
    <div style="margin:0 auto;width:100%">
            <el-table :data="data.lists" :height="winheight-100" @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column fixed prop="id" label="id" width="100"></el-table-column>
                <el-table-column prop="icon" label="头像" width="50">
                    <template slot-scope="scope">
                        <img v-if="scope.row.icon" :src="scope.row.icon" alt="" style="height:30px">
                    </template>
                </el-table-column>
                <el-table-column prop="username" label="用户名" width="120"></el-table-column>
                <el-table-column prop="name" label="姓名" width="100"></el-table-column>
                <el-table-column prop="nickname" label="昵称" width="140"></el-table-column>
                <el-table-column prop="nickname" label="权限">
                    <template slot-scope="scope">
                        <el-tag type="success">{{scope.row.title}}</el-tag>
                        <el-tag>{{scope.row.describes}}</el-tag>
                    </template>
                </el-table-column>
                <el-table-column prop="phone" label="手机" width="120"></el-table-column>
                <el-table-column prop="logintime" label="登录时间" width="100">
                    <template slot-scope="scope">
                        <span v-html="time_date(scope.row.logintime)"></span>
                    </template>
                </el-table-column>
                <el-table-column prop="addtime" label="添加时间" width="100">
                    <template slot-scope="scope">
                        <span v-html="time_date(scope.row.addtime)"></span>
                    </template>
                </el-table-column>
                <el-table-column fixed="right" label="操作" width="180">
                <template slot-scope="scope">
                    <el-button @click="clickedit(scope.row)" size="small">编辑</el-button>
                    <el-button size="small" @click="setpwd(scope.row.id)">设置密码</el-button>
                </template>
                </el-table-column>
            </el-table>
            <div class="block" style="background:#FFF;margin-top:4px;height:36px;padding-top:4px">
                <span style="float:left;margin-top:2px">&nbsp&nbsp&nbsp<el-button size="mini" type="danger" @click="deletes" icon="el-icon-delete">删除选中</el-button>&nbsp</span>
                <el-pagination background
                    @size-change="handleSizeChange" @current-change="handleCurrentChange"
                    :current-page="1" :page-size="data.pagesize"
                    layout="total, sizes, prev, pager, next, jumper" :total="data.count">
                </el-pagination>
            </div>
    </div>
    <el-dialog
    :title="admindialog.title"
    :visible.sync="admindialog.status"
    width="500px">
    <div style="padding:10px;">
        <el-form ref="form" :model="admin" label-width="120px" label-position="left" size="mini">
            <el-form-item label="姓名">
                <el-input placeholder="姓名" v-model="admin.name"></el-input>
            </el-form-item>
            <el-form-item label="头像地址">
                <el-input placeholder="头像地址" v-model="admin.icon" style="width:70%"></el-input>
                <el-button @click="openurl('/intapp/imgmt?select=1')" size="mini">选择图片</el-button>
            </el-form-item>
            <el-form-item label="用户名">
                <el-input placeholder="用户名" v-model="admin.username"></el-input>
            </el-form-item>
            <el-form-item v-if="!admin.id" label="登录密码">
                <el-input placeholder="登录密码" v-model="admin.password"></el-input>
            </el-form-item>
            <el-form-item label="手机号">
                <el-input placeholder="手机号" v-model="admin.phone"></el-input>
            </el-form-item>
            <el-form-item label="昵称">
                <el-input placeholder="昵称" v-model="admin.nickname"></el-input>
            </el-form-item>
            <el-form-item label="所属角色">
                <el-select v-model="admin.role" placeholder="请选择">
                    <el-option v-for="item in rolelist" :key="item.id" :label="item.title" :value="item.id">{{item.title}}</el-option>
                </el-select>
            </el-form-item>
            <el-form-item v-if="filegpath!=-1 && admin.role!=1" label="设置授权目录">
                <span v-if="filegpath==-1" type="text"></span>
                <div v-else-if="filegpath">
                    <el-button @click="openurl('intapp/file/?select=1&paths='+filegpath)" type="text">{{filegpath}}</el-button>
                    <el-button @click="filegpath='';setfilepaths()" type="text">删除</el-button>
                </div>
                <el-button v-else type="text" @click="openurl('intapp/file/?select=1&paths='+filegpath)">设置授权目录</el-button>
            </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="admindialog.status = false">取 消</el-button>
                <el-button v-if="admin.id" type="primary" @click="update">修改</el-button>
                <el-button v-else type="primary" @click="insert">添加</el-button>
            </span>
    </div>
    </el-dialog>
</div>
</body>
<script>
function setimgmt(domain,paths,item){
    mysetfile(domain,paths,item)
    layer.closeAll();
}
function setfile(paths,item,select){
    layer.closeAll();
    setfilepaths(paths,item,select)
}
var vm = new Vue({
    el: '#app',
    data: {
        winheight:document.documentElement.clientHeight,winwidth:document.documentElement.clientWidth,
        admin:{name:'',icon:'',username:'',password:'',phone:'',nickname:'',role:0},admindialog:{status:false,title:'添加管理'},
        kw:'',
        data:{
            'pagesize':20,
            'count':0,
            'pagenow':1,
            'lists':[]
        },Change:[],
        rolelist:[],
        filegpath:"",//文件管理授权目录
    },
    mounted:function(){
        self=this
        window.onresize = function(){
            self.winheight=document.documentElement.clientHeight
            self.winwidth=document.documentElement.clientWidth
        }
        window.mysetfile = this.mysetfile;
        window.setfilepaths = this.setfilepaths;
        self.getrolelist()
    },
    methods: {
        mysetfile:function(domain,paths,item){
            if (item.suffix=='jpg' || item.suffix=='JPG' || item.suffix=='png' || item.suffix=='PNG' || item.suffix=='gif' || item.suffix=='GIF'){
                self.admin.icon=domain+paths+item.name
            }else{
                self.$message({type: 'error',message: '请选择图片文件'});
            }
        },setfilepaths:function(paths,item,select){
            var self=this
            if(paths){
                self.filegpath=paths+item.name
            }else{
                self.filegpath=""
            }
            self.put("/intapp/file/index/setrolepath/"+self.admin.id+"?filegpath="+self.filegpath).then(function(res){
                self.$message({type: 'success',message: '成功'});
            }).catch(function(err){
                self.filegpath=-1
            })
        },
        clickedit:function(item){
            self=this
            self.admindialog.status=true,self.admin=item
            self.getrolepath(item.id)
        },
        getrolepath:function(adminid){//获取用户授权目录
            self=this
            self.get("/intapp/file/index/getrolepath/"+adminid).then(function(res){
                self.filegpath=res.data
            }).catch(function(err){
                self.filegpath=-1
            })
        },
        dellogin:function(){
            self=this
            self.delete("/intapp/index/admin/dellogin").then(function(res){
                self.$message({type: 'success',message: '所有用户已退出!'});
                setTimeout(function(){
                    top.location.reload();
                },2000)
            })
        },
        getrolelist:function(){
            self=this
			self.get("/intapp/index/admin/getrolelist",{'kw':self.kw,'pagesize':self.data.pagesize,'pagenow':self.data.pagenow},'获取中...').then(function(res){
				self.rolelist=res.data.lists
                self.getlist()
			})
        },
        openurl:function(url){
            layer.open({
                type: 2,title: false,shadeClose: true,shade: 0.8,
                area: ['80%', '90%'],content:url
            }); 
        },
        getlist:function(){
            self=this
			self.get("/intapp/index/admin/getlist",{'kw':self.kw,'pagesize':self.data.pagesize,'pagenow':self.data.pagenow},'获取中...').then(function(res){
				self.data=res.data
			})
        },
        insert:function(){
			self=this
			self.admin['password']=md5('kcw'+self.admin['password'])
			self.post("/intapp/index/admin/insert",self.admin,"请稍后...").then(function(res){
				self.admindialog.status=false
				self.getlist()
			}).catch(function(err){
                self.admindialog.status=false
            })
		},
        deletes:function(){
			self=this
			if(!self.Change.length){
				self.$message.error('您未选择任何内容');
			}else{
				self.$confirm('此操作将永久删除该记录, 是否继续?', '删除提醒', {
				confirmButtonText: '删除',
				cancelButtonText: '取消',
				type: 'warning'
				}).then(function(){
					id=[]
					for(var i=0;i<self.Change.length;i++){
						id.push(self.Change[i].id)
					}
					self.delete("/intapp/index/admin/delete",id,"正在删除中...").then(function(res){
						self.data.pagenow=1
						self.getlist()
						self.$message({type: 'success',message: '选中记录已删除!'});
					})
				}).catch(function(){});
			}
		},
        update:function(){
			self=this
			self.put("/intapp/index/admin/update",self.admin,"请稍后...").then(function(res){
				self.admindialog.status=false
			})
		},
        setpwd:function(id) {
			self=this
			self.$prompt('请输新密码', '提示', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			inputValidator:function(value){
				if(value.length>=6&&value.length<=10){
					return true
				}else{
					return "请输入6到10位字符"
				}
			}
			}).then(function(value){
				self.put('/intapp/index/admin/setpwd',{'id':id,password:md5('kcw'+value.value)}).then(function(res){
					self.$message({type: 'success',message: '您的设置的密码是: ' + value.value});
				})
			}).catch(function(){});
		},
        handleSelectionChange:function(val) {
            self=this
			self.Change=val
		},
        handleSizeChange:function(val) {
            self=this
			self.data.pagesize=val
			self.getlist()
		},
        handleCurrentChange:function(val) {
			self.data.pagenow=val
			self.getlist()
		}
    }
});
</script>
</html>
